@sideBarWidth: 250px;
@menuItemHeight: 44px;
@headerHeight: 44px;

@sideBarBorderColor: #424242;

body {
	font: normal 11px Helvetica, sans-serif;
	background: #FFF;
	font-size: 110%;
	overflow: hidden;
}

#fLayoutContentWrap {
	margin-left: @sideBarWidth;	
}

#fLayoutArticleWrap {
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
}

.f-ipad-corner-top-left, 
.f-ipad-corner-top-middle,
.f-ipad-corner-top-right,
.f-ipad-corner-bottom-left,
.f-ipad-corner-bottom-middle,
.f-ipad-corner-bottom-right {
	position: fixed;
	height: 5px;
	width: 5px;
	z-index: 99999;
	background: url() no-repeat;
}

.f-ipad-corner-top-left { left: 0; top: 0; background-position: -6px 0; }
.f-ipad-corner-top-middle { width: 10px; left: @sideBarWidth - 6; top: 0; }
.f-ipad-corner-top-right { right: 0; top: 0; }
.f-ipad-corner-bottom-left { left: 0; bottom: 0; background-position: -6px -5px; }
.f-ipad-corner-bottom-middle { width: 10px; left: @sideBarWidth - 6; bottom: 0; 
	background-position: 0px -5px; }
.f-ipad-corner-bottom-right { right: 0; bottom: 0; background-position: 0 -5px; }

#fLayoutNavigationWrap {
	width: @sideBarWidth;
	position: fixed;
	-webkit-box-sizing: border-box;
	bottom: 0;
	top: 0;
	left: 0;
	border-right: 1px solid @sideBarBorderColor;
	background: #D2D5DB url() repeat-x;
	padding-top: @headerHeight;
	ul {
		padding: 0;
		display: block;
		position: absolute;
		top: @headerHeight;
		left: 0;
		right: 0;
		overflow-x: hidden;
		overflow-y: auto;
		list-style: none;
		background: #D2D5DB;
		border-bottom: 1px solid #DDE0E3;
		li {
			font-size: 14px;
			text-shadow: 0px 1px 0px #FFF;
			margin: 0;
			padding: 0;
			display: block;
			border-top: 1px solid #DDE0E3;
			border-bottom: 1px solid #C3C6CC;
			&.f-selected {
				background: url() repeat-x;
				border: 0;
				padding: 1px 0;
				a {
					color: #FFF;
					text-shadow: 0px 1px 0px #666;
					background: url() center right no-repeat;
				}
			}
			a {
				color: #000;
				text-decoration: none;
				display: block;
				outline: none;
				width: 100%;
				height: @menuItemHeight - 2;
				span {
					line-height: @menuItemHeight;
					padding: 0 0 0 10px;
				}
			}
		}		
	}
}

#fLayoutHeaderWrap {
	width: @sideBarWidth;
	height: @headerHeight;
	position: fixed;
	top: 0;
	left: 0;
	font-size: 16px;
	color: #717880;
	text-shadow:0px 1px 0px #FFFFFF;
	text-align: center;
	line-height: @headerHeight;
	z-index: 1;
}

#flayoutarticlewrap article {
	-webkit-box-sizing: border-box;
	min-height: 100%;
}